<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
    <meta name="keywords" content="mkn网">
    <meta name="content" content="mkn网">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <link type="text/css" rel="stylesheet" href="../css/dreamland.css">
    <script type="text/javascript" src="../js/plugins/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="../js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="../plugins/angularjs/angular.min.js"></script>
</head>

<body class="login_bj" style="background-color: grey">
<script type="text/javascript">
    var app = angular.module('register',[]);
    app.controller('yzmController',function ($scope,$http) {
        // $scope.user = $scope;
        //验证手机号码
        $scope.name = function () {

            if ($scope.user == null){
                alert("input your information");
            } else {
                $http.get('../selectPhone?phone='+$scope.user.phone).success(function (response) {  //判断手机？
                    if (response.success){
                        $scope.checkName();  //判断用户名
                    }else{
                        alert(response.message);
                    }
                })
            }
        }
        //验证用户名，也就是这个
        $scope.checkName = function () {
            $http.get('../checkName?username='+$scope.user.username + "&yzm="+$scope.user.code).success(function (response) {
                if (response.success){

                    $scope.insertRegister(); //插入数据库ok,现在要找到checkEmail在哪里

                } else {
                    alert(response.message);
                }
            })
        }
        //数据库添加数据
        $scope.insertRegister = function () {
            $http.post('../insertRegister',$scope.user).success(function (response) {
                if (response.success){
                    alert("注册成功，请进行登录");
                    window.location.href="login.html";
                } else {
                    alert(response.message);
                }
            })
        }
    })

</script>

<div class="zhuce_body" >
    <div class="zhuce_kong" id="dre_div">
        <div class="zc">
            <div class="bj_bai" id="regist-left" style="height: 468px">
                <h3>欢迎注册</h3>
                <form action="" method="post" id="registerForm" name="myForm" novalidate ng-app="register" ng-controller="yzmController">
                    <span id="reg_span"></span>
                    <input id="phone" name="phone" type="text" class="kuang_txt phone" placeholder="手机号" ng-model="user.phone"
                           ng-pattern="/^1[3|4|5|7|8]\d{9}$/" required>   <span ng-show="myForm.phone.$valid" style="color: green">√</span>
                    <br/>
                    <span style="color:red" ng-show="myForm.phone.$dirty && myForm.phone.$invalid">
                    <span ng-show="myForm.phone.$error.required">手机号码必须填写!</span>
                    <span ng-show="myForm.phone.$error.pattern">手机号码为11位数字!</span>
                    </span>

                    <input id="email" name="email" type="email" class="kuang_txt email" placeholder="邮箱" ng-model="user.email" required> <span ng-show="myForm.email.$valid" style="color: green">√</span>
                    <br/>
                    <span id="mail_span" style="color: red" ng-show="myForm.email.$dirty && myForm.email.$invalid">
                        <span ng-show="myForm.email.$error.email">邮箱格式错误！</span>
                        <span ng-show="myForm.email.$error.required">邮箱必须填写！</span>
                    </span>

                    <input id="password" name="password" type="password" class="kuang_txt possword" placeholder="密码" ng-model="user.password" required> <span ng-show="myForm.password.$valid" style="color: green">√</span>
                    <br/>
                    <span id="password_span" style="color: red" ng-show="myForm.password.$dirty && myForm.password.$invalid">
                        <span ng-show="myForm.password.$error.required">请设置密码</span>
                    </span>

                    <input id="username" name="username" type="text" class="kuang_txt possword" placeholder="昵称" ng-model="user.username" required> <span ng-show="myForm.username.$valid" style="color: green">√</span>
                    <br/>
                    <span id="username_span" style="color: red" ng-show="myForm.username.$dirty && myForm.username.$invalid">
                        <span ng-show="myForm.username.$error.required">请设置用户名</span>
                    </span>
                    <input id="code" name="code" type="text" class="kuang_txt yanzm" placeholder="验证码" ng-model="user.code" required>
                    <div>
                        <img id="captchaImg" style="CURSOR: pointer"
                             title="看不清楚?请点击刷新验证码!" align='absmiddle' src="/code" onclick="this.src='/code?'+Math.random()"
                             height="18" width="55">
                        <a href="javascript:;"
                           style="color: #666;">看不清楚</a> <span id="code_span" style="color: red" ng-show="myForm.code.$dirty && myForm.code.$invalid">
                        <span ng-show="myForm.code.$error.required">请输入验证码</span>
                    </span>
                    </div>
                    <button name="注册" type="button" class="btn_zhuce" id ="to_register" value="注册" ng-click="name()">注册</button>
                    <br/>
                    <span style="color: red"></span>

                </form>
            </div>
            <div id="regist-right" class="bj_right" style="height: 468px">
                <p>未开发</p>
                <a href="#" class="zhuce_qq">这是</a>
                <a href="#" class="zhuce_wb">一个</a>
                <a href="#" class="zhuce_wx">模板</a>
                <p>已有账号？<a href="login.html">立即登录</a></p>
            </div>
        </div>
    </div>
</div>

<div style="text-align:center;">
</div>
</body>

</html>